<template>
	<view class="commit">
		<view class="commit-list-title" v-if="commitRows.length">
			评论:({{commitRows.length}})
		</view>
		<view class="commit-list" v-for="item in commitRowsSort">
			<view class="commit-list-left">
				<p>{{item.userName}}:</p>
				<p>{{item.content}}</p>
			</view>
			<view class="commit-list-right">
				<p @click="setSupport" :data-id="item.id">👍{{item.likeNum}}</p>
				<p>{{item.commentDate}}</p>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: "CommitList",
		props: ["commitRows"],
		data() {
			return {
				
			}
		},
		computed : {
			commitRowsSort :function () {
				return this.commitRows.sort((a,b) => a.id-b.id)
			}
		},
		created() {
			
		},
		methods : {
			// 评论点赞
			setSupport (e) {
				console.log(e.currentTarget.dataset.id)
			}
		}
	}
</script>

<style scoped>
	.commit {
		margin-bottom: 3em;
	}
	.commit-list-title {
		font-size: 1.25em;
	}

	.commit-list {
		display: flex;
		flex-direction: column;
	}

	.commit-list-left>p:last-child {
		text-indent: 2em;
	}

	.commit-list-right {
		margin-top: .5em;
		text-align: right;
		font-size: .8em;
	}
</style>
